<template>
  <div class="goodesmodelbox">
    <el-dialog
      title="订单详情"
      :showClose="false"
      :visible.sync="centerDialogVisible"
      fullscreen
      width="100%"
      height="100%"
    >
      <p style="margin-top: 10px">
        当前位置：<span style="margin-left: 5px">订单详情</span>
        <!-- {{ currentRow }} -->
      </p>
      <el-steps
        :active="
          currentRow.orderStatus == 1
            ? 1
            : currentRow.orderStatus == 3
            ? 2
            : currentRow.orderStatus == 4
            ? 3
            : currentRow.orderStatus == 6
            ? 4
            : 0
        "
        finish-status="success"
        align-center
      >
        <el-step
          title="买家下单"
          :description="currentRow.orderStatus == 1 ? currentRow.orderTime : ''"
        ></el-step>
        <el-step
          title="买家付款"
          :description="currentRow.orderStatus == 3 ? currentRow.payTime : ''"
        ></el-step>
        <el-step
          title="商家发货"
          :description="
            currentRow.orderStatus == 4 ? currentRow.deliveryTime : ''
          "
        ></el-step>
        <el-step
          title="订单完成"
          :description="
            currentRow.orderStatus == 6 ? currentRow.finishTime : ''
          "
        ></el-step>
      </el-steps>
      <!-- 内容板块 -->
      <div class="orderContent">
        <div class="orderLeft">
          <div>
            <span>订单编号：</span><span>{{ currentRow.orderCode }}</span>
          </div>
          <!-- <div>
            <span>优惠金额：</span><span>{{ currentRow.discountAmount }}</span>
          </div> -->
          <div>
            <span>付款方式：</span
            ><span>{{
              currentRow.orderCode == 1
                ? "微信支付"
                : currentRow.orderCode == 2
                ? "支付宝"
                : "银联支付"
            }}</span>
          </div>
          <div>
            <span>客户姓名：</span><span>{{ currentRow.buyerName }}</span>
          </div>
          <div>
            <span>配送方式：</span
            ><span>{{
              currentRow.shippingWay == 1 ? "送货上门" : "客户自提"
            }}</span>
          </div>
          <div>
            <span>收货人姓名：</span><span>{{ currentRow.consigneeName }}</span>
          </div>
          <div>
            <span>收货人电话：</span
            ><span>{{ currentRow.consigneePhone }}</span>
          </div>
          <div>
            <span>收货人地址：</span
            ><span>{{
              currentRow.proviceName +
              " " +
              currentRow.cityName +
              " " +
              currentRow.countyName +
              " " +
              currentRow.consigneeAddress
            }}</span
            ><span
              class="copy"
              @click="
                copyToClip(
                  currentRow.proviceName +
                    currentRow.cityName +
                    currentRow.countyName +
                    currentRow.consigneeAddress
                )
              "
              >复制</span
            >
          </div>
          <div
            @click="editOrder"
            class="orderEdit"
            v-if="currentRow.orderStatus !== 7"
          >
            修改订单收货信息
          </div>
        </div>
        <!-- //待发货 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 3">
          <!-- <div v-if="currentRow.orderStatus == 4">
            <span>订单状态：</span><span class="orderStatus">待收货</span
            ><span>（商家已发货，等待买家收货并交易完成）</span>
          </div> -->
          <div>
            <span>订单状态：</span><span class="orderStatus">待发货</span
            ><span>（买家已经付款，请商家尽快发货）</span>
          </div>
          <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <!-- <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div> -->
          <div>
            <span>快递单号：</span><span>{{ currentRow.expressCode }}</span>
          </div>
          <!-- <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div> -->
          <div class="Confirm" @click="addopen">确认发货</div>
          <div>
            <!-- <span class="Modified" @click="ModifiedLogistics">修改物流</span
            ><span class="Cancellation" @click="Canceldelivery">取消发货</span
            > -->
            <span class="addNote" @click="addNote">添加备注</span>
          </div>
          <div>
            <span
              >友情提示： 如果无法进行发货，请及时联系买家进行妥善处理;</span
            >
          </div>
        </div>
        <!-- //待收货 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 4">
          <div>
            <span>订单状态：</span><span class="orderStatus">待收货</span
            ><span>（商家已发货，等待买家收货并交易完成）</span>
          </div>
          <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.expressCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div>
          <div class="Confirm" @click="open">确认收货</div>
          <div>
            <span class="Modified" @click="ModifiedLogistics">修改物流</span
            ><span class="Cancellation" @click="Canceldelivery">取消发货</span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div>
          <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div>
        </div>

        <!-- //待付款 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 1">
          <div>
            <span>订单状态：</span><span class="orderStatus">待付款</span>
          </div>
          <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <!-- <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.courierCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div> -->
          <!-- <div class="Confirm" @click="open">确认收货</div> -->
          <div>
            <span class="Modified" @click="ModifiedLogistics"></span
            ><span class="Cancellation" @click="Canceldelivery"></span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div>
          <!-- <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div> -->
        </div>
        <!-- //交易完成 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 6">
          <div>
            <span>订单状态：</span><span class="orderStatus">交易完成</span>
          </div>

          <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.expressCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div>
          <!-- <div class="Confirm" @click="open">确认收货</div> -->
          <div>
            <span class="Modified" @click="ModifiedLogistics"></span
            ><span class="Cancellation" @click="Canceldelivery"></span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div>
          <div>
            <span
              >友情提示：
              交易成功，如买家有售后申请，请与买家进行协商，妥善处理</span
            >
          </div>
        </div>
        <!-- //待审核 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 2">
          <div>
            <span>订单状态：</span><span class="orderStatus">待审核</span>
          </div>

          <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <!-- <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.courierCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div> -->
          <!-- <div class="Confirm" @click="open">确认收货</div> -->
          <div>
            <span class="Modified" @click="ModifiedLogistics"></span
            ><span class="Cancellation" @click="audit">审核</span>
            <span class="addNote" @click="addNote">添加备注</span>
          </div>
          <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div>
        </div>

        <!-- //待评价 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 5">
          <div>
            <span>订单状态：</span><span class="orderStatus">待评价</span>
          </div>

          <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.expressCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div>
          <!-- <div class="Confirm" @click="open">确认收货</div>
          <div>
            <span class="Modified" @click="ModifiedLogistics">修改物流</span
            ><span class="Cancellation" @click="Canceldelivery">取消发货</span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div> -->
          <!-- <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div> -->
        </div>

        <!-- //已取消 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 8">
          <div>
            <span>订单状态：</span><span class="orderStatus">已取消</span>
          </div>
          <!-- <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.courierCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div>
          <div class="Confirm" @click="open">确认收货</div>
          <div>
            <span class="Modified" @click="ModifiedLogistics">修改物流</span
            ><span class="Cancellation" @click="Canceldelivery">取消发货</span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div> -->
          <!-- <div class="Confirm" @click="addopen">确认发货</div> -->
          <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div>
        </div>

        <!-- 已驳回 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 7">
          <div>
            <span>订单状态：</span><span class="orderStatus">已驳回</span>
          </div>
          <div>
            <span>驳回理由：</span><span>{{ currentRow.rejectReason }}</span>
          </div>
          <!-- <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.courierCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div>
          <div class="Confirm" @click="open">确认收货</div>
          <div>
            <span class="Modified" @click="ModifiedLogistics">修改物流</span
            ><span class="Cancellation" @click="Canceldelivery">取消发货</span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div> -->
          <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div>
        </div>
        <!-- 退款完成 -->
        <div class="orderRight" v-if="currentRow.orderStatus == 9">
          <div>
            <span>订单状态：</span><span class="orderStatus">退款完成</span>
          </div>
          <!-- <div>
            <span>驳回理由：</span><span>{{ currentRow.rejectReason }}</span>
          </div> -->
          <!-- <div>
            <span>卖家备注：</span><span>{{ currentRow.note }}</span>
          </div>
          <div>
            <span>买家留言：</span><span>{{ currentRow.buyerMessage }}</span>
          </div>
          <div>
            <span>快递公司：</span><span>{{ currentRow.buyerMessage }}</span
            ><span class="logistics" @click="checkLogistics">查看物流</span>
          </div>
          <div>
            <span>快递单号：</span><span>{{ currentRow.courierCode }}</span>
          </div>
          <div>
            <span>发货时间：</span><span>{{ currentRow.deliveryTime }}</span>
          </div>
          <div class="Confirm" @click="open">确认收货</div>
          <div>
            <span class="Modified" @click="ModifiedLogistics">修改物流</span
            ><span class="Cancellation" @click="Canceldelivery">取消发货</span
            ><span class="addNote" @click="addNote">添加备注</span>
          </div> -->
          <div>
            <span
              >友情提示： 请及时关注物流状态，确保买家及时收到商品;
              如果买家未收到货物或有退换货请求，请及时联系买家妥善处理</span
            >
          </div>
        </div>
      </div>
      <!-- 内嵌弹框 -->
      <div
        style="
          font-size: 20px;
          font-weight: bold;
          margin-top: 10px;
          margin-left: 5%;
        "
      >
        商品信息
      </div>
      <el-table
        :header-cell-style="{ 'text-align': 'center' }"
        :cell-style="{ 'text-align': 'center' }"
        :data="currentRow.orderDetailesList"
        border
        style="width: 90%; margin-left: 5%; margin-top: 20px"
      >
        <el-table-column fixed label="商品标题">
          <template slot-scope="prop">
            <div style="display: flex; justify-content: space-between">
              <img
                :src="prop.row.goodsThumbnail"
                alt=""
                width="70px"
                height="70px"
              />
              <div style="width=270px; height=70px;text-align: start">
                {{ prop.row.goodsName }}
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column label="规格">
          <template slot-scope="prop">
            <div>规格：{{ prop.row.specAttr }}</div>
            <!-- <div>编码：无</div>
            <div>条码：无</div> -->
          </template>
        </el-table-column>
        <el-table-column label="单价">
          <template slot-scope="prop">
            {{ prop.row.price / 100 }}
          </template>
        </el-table-column>
        <el-table-column prop="amount" label="数量"> </el-table-column>
        <el-table-column label="小计">
          <template slot-scope="prop">
            {{ prop.row.subtotal / 100 }}
          </template>
        </el-table-column>
      </el-table>
      <div width="" style="text-align: right; width: 95%">
        <p>
          <span>商品小计：</span><span>{{ totalPrice / 100 }}</span>
        </p>
        <p>
          <span>数量合计：</span><span>{{ currentRow.goodsAmount }}</span>
        </p>
        <p><span>运费：</span><span>￥0</span></p>
        <p>
          <span>折扣优惠：</span
          ><span>{{ currentRow.discountAmount / 100 }}</span>
        </p>
        <p>
          <span>优惠券优惠：</span
          ><span>{{ currentRow.couponDeductionAmount / 100 }}</span>
        </p>
        <p>
          <span>实付款：</span><span>{{ currentRow.paidAmount / 100 }}</span>
        </p>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="cancelgoodesmodel">取 消</el-button>
        <el-button type="primary" @click="savegoodesmodel">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 修改订单收货信息 -->
    <div>
      <el-dialog
        title="编辑订单收货信息"
        :visible.sync="dialogVisible"
        width="35%"
        :close-on-click-modal="false"
      >
        <span></span>
        <el-form
          ref="editForm"
          :model="editForm"
          :inline="true"
          label-width="auto"
        >
          <el-form-item label="收货人">
            <el-input
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.consigneeName"
            ></el-input>
          </el-form-item>
          <el-form-item label="手机">
            <el-input
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.consigneePhone"
            ></el-input>
          </el-form-item>
          <el-form-item label="详细地址">
            <!-- <span>{{
              currentRow.proviceName +
              " " +
              currentRow.cityName +
              currentRow.countyName +
              currentRow.consigneeAddress
            }}</span> -->
            <el-input
              disabled
              type="text"
              :style="{ width: '380px', marginLeft: '20px' }"
              :value="
                currentRow.proviceName +
                ' ' +
                currentRow.cityName +
                ' ' +
                currentRow.countyName +
                ' ' +
                currentRow.consigneeAddress
              "
            ></el-input>
          </el-form-item>
          <el-form-item prop="address" label="新省市区">
            <el-cascader
              ref="myCascader"
              v-model="editForm.address"
              :options="addressList"
              clearable
              placeholder="请选择地址"
              :style="{ width: '380px', marginLeft: '20px' }"
            ></el-cascader>
          </el-form-item>
          <el-form-item label="新地址">
            <el-input
              type="text"
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.consigneeAddress"
            ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="tModOrderUpdate">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 修改物流 -->
    <div>
      <el-dialog
        title="修改物流信息"
        :visible.sync="Modified"
        width="30%"
        :close-on-click-modal="false"
      >
        <span></span>

        <span slot="footer" class="dialog-footer">
          <el-button @click="Modified = false">取 消</el-button>
          <el-button type="primary" @click="Modified = false">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 取消发货 -->
    <div>
      <el-dialog
        title="取消发货"
        :visible.sync="delivery"
        width="30%"
        :close-on-click-modal="false"
      >
        <span></span>
        <el-form
          ref="editForm"
          :model="editForm"
          :inline="true"
          label-width="auto"
        >
          <el-form-item>
            <el-input
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.cancelReason"
              type="textarea"
              placeholder="请写取消理由"
            ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="delivery = false">取 消</el-button>
          <el-button type="primary" @click="deliveryReason">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 添加备注 -->
    <div>
      <el-dialog
        title="添加备注"
        :visible.sync="note"
        width="30%"
        :close-on-click-modal="false"
      >
        <span></span>
        <el-form
          ref="editForm"
          :model="editForm"
          :inline="true"
          label-width="auto"
        >
          <el-form-item>
            <el-input
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.note"
              type="textarea"
              placeholder="卖家留言"
            ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="note = false">取 消</el-button>
          <el-button type="primary" @click="addNoteclick">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    <!-- 查看物流 -->
    <div>
      <el-dialog
        title="物流信息"
        :visible.sync="check"
        width="30%"
        :close-on-click-modal="false"
      >
        <span></span>

        <span slot="footer" class="dialog-footer">
          <el-button @click="check = false">取 消</el-button>
          <el-button type="primary" @click="check = false">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    //订单发货
    <div>
      <el-dialog
        title="订单发货"
        :visible.sync="orderDelivery"
        width="30%"
        :close-on-click-modal="false"
      >
        <span></span>
        <el-form
          ref="editForm"
          :model="editForm"
          :inline="true"
          label-width="auto"
        >
          <el-form-item label="收货人">
            <span
              >联系人：{{
                currentRow.buyerName +
                " " +
                "/" +
                " " +
                currentRow.consigneePhone
              }}</span
            >
            <div>
              地址：{{
                currentRow.proviceName +
                currentRow.cityName +
                currentRow.countyName +
                currentRow.consigneeAddress
              }}
            </div>
          </el-form-item>
          <el-form-item label="发货单号">
            <el-input
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.expressCode"
              type="text"
              placeholder="请填写快递单号（必填）"
            ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="orderDelivery = false">取 消</el-button>
          <el-button type="primary" @click="orderDeliverys">确 定</el-button>
        </span>
      </el-dialog>
    </div>
    //审核弹窗
    <div>
      <el-dialog
        title="审核"
        :visible.sync="AuditPopup"
        width="30%"
        :close-on-click-modal="false"
      >
        <span></span>
        <el-form
          ref="editForm"
          :model="editForm"
          :inline="true"
          label-width="auto"
        >
          <el-form-item>
            <el-input
              :style="{ width: '380px', marginLeft: '20px' }"
              v-model="editForm.rejectReason"
              type="textarea"
              placeholder="若是驳回请填写驳回理由！"
            ></el-input>
          </el-form-item>
        </el-form>
        <span slot="footer" class="dialog-footer">
          <el-button @click="consent">同意</el-button>
          <el-button type="primary" @click="turnDown">驳回</el-button>
        </span>
      </el-dialog>
    </div>
  </div>
</template>

<script>
document.addEventListener('contextmenu', function(e) {
  e.preventDefault();
});

import {
  orderUpdate,
  getOrderDetails,
  updateStatus,
} from "@/api/mallApi/congLinMall";
import areaJson from "./area.json";
export default {
  name: "OrderModel",
  components: {},
  props: {
    centerDialogVisible: Boolean,
    currentRow: Object,
  },
  data() {
    return {
      addressList: areaJson,
      cancelText: "",
      editForm: {
        address: [],
        newAdd: "",
      },
      form: {}, //目前没用到这个form
      AuditPopup: false,
      orderDelivery: false,
      dialogVisible: false,
      delivery: false,
      Modified: false,
      note: false,
      check: false,
      // SelloutData: this.currentRow.orderDetailesList,
    };
  },
  // mounted() {
  //   console.log("vv", this.currentRow.orderDetailesList);
  //   this.SelloutData = this.currentRow.orderDetailesList;
  // },
  computed: {
    // 计算总价的计算属性
    totalPrice() {
      let total = 0;
      // 遍历购物车商品列表，累加每个商品的总价
      this.currentRow?.orderDetailesList?.forEach((item) => {
        total += item.price * item.amount; // 假设商品的单价和数量存储在price和quantity属性中
        console.log("total", total);
      });
      return total; // 保留两位小数
    },
  },
  methods: {
    //同意
    consent() {
      const { id } = this.editForm;
      const values = {
        id,
        orderStatus: 3, //待发货
      };
      console.log("tModOrderUpdate", values);
      orderUpdate(values).then((res) => {
        if (res.success && res.code === "00000") {
          this.AuditPopup = false;
          this.$message({
            message: "修改成功",
            type: "success",
          });
          getOrderDetails({
            orderCode: this.currentRow.orderCode,
          }).then((res2) => {
            this.currentRow = res2.data;
          });
        }
      });
    },
    //驳回
    turnDown() {
      const { rejectReason, id } = this.editForm;
      const values = {
        rejectReason,
        id,
        orderStatus: 7, //已驳回
      };
      console.log("tModOrderUpdate", values);
      orderUpdate(values).then((res) => {
        if (res.success && res.code === "00000") {
          this.AuditPopup = false;
          this.$message({
            message: "修改成功",
            type: "success",
          });
          getOrderDetails({
            orderCode: this.currentRow.orderCode,
          }).then((res2) => {
            this.currentRow = res2.data;
          });
        }
      });
    },
    //取消发货理由
    deliveryReason() {
      const { cancelReason, id } = this.editForm;
      const values = {
        cancelReason,
        id,
        orderStatus: 8,
      };
      console.log("tModOrderUpdate", values);
      orderUpdate(values).then((res) => {
        if (res.success && res.code === "00000") {
          this.delivery = false;
          this.$message({
            message: "修改成功",
            type: "success",
          });
          getOrderDetails({
            orderCode: this.currentRow.orderCode,
          }).then((res2) => {
            this.currentRow = res2.data;
          });
        }
      });
    },
    //确定订单发货
    async orderDeliverys() {
      const { expressCode, id } = this.editForm;
      const values = {
        expressCode,
        id,
        orderStatus: 4,
      };
      console.log("tModOrderUpdate", values);
      orderUpdate(values).then((res) => {
        if (res.success && res.code === "00000") {
          this.orderDelivery = false;
          this.$message({
            message: "修改成功",
            type: "success",
          });
          getOrderDetails({
            orderCode: this.currentRow.orderCode,
          }).then((res2) => {
            this.currentRow = res2.data;
          });
        }
      });
    },
    //添加备注
    async addNoteclick() {
      const { note, id } = this.editForm;
      const values = {
        note,
        id,
      };
      console.log("tModOrderUpdate", values);
      orderUpdate(values).then((res) => {
        if (res.success && res.code === "00000") {
          this.note = false;
          this.$message({
            message: "修改成功",
            type: "success",
          });
          getOrderDetails({
            orderCode: this.currentRow.orderCode,
          }).then((res2) => {
            this.currentRow = res2.data;
          });
        }
      });
    },
    //修改订单收货
    async tModOrderUpdate() {
      const [proviceName, cityName, countyName] =
        this.$refs["myCascader"].getCheckedNodes()[0].pathLabels;
      const [proviceCode, cityCode, countyCode] = this.editForm.address;
      console.log("editform", this.editForm);
      const { id, consigneeName, consigneePhone, consigneeAddress } =
        this.editForm;
      const values = {
        id,
        consigneeName,
        consigneePhone,
        consigneeAddress,
        proviceCode,
        cityCode,
        countyCode,
        proviceName,
        cityName,
        countyName,
      };
      console.log("tModOrderUpdate", values);
      orderUpdate(values).then((res) => {
        if (res.success && res.code === "00000") {
          this.dialogVisible = false;
          this.$message({
            message: "修改成功",
            type: "success",
          });
          getOrderDetails({
            orderCode: this.currentRow.orderCode,
          }).then((res2) => {
            this.currentRow = res2.data;
          });
        }
      });
    },
    copyToClip(content) {
      var aux = document.createElement("textarea");
      aux.value = content;
      document.body.appendChild(aux);
      aux.select(" ");
      document.execCommand("copy");
      document.body.removeChild(aux);
      this.$message({
        message: "复制成功",
        type: "success",
      });
    },
    //打开审核弹窗
    audit() {
      this.AuditPopup = true;
      this.editForm = {
        ...this.currentRow,
      };
    },
    //打开确认发货弹框
    addopen() {
      this.orderDelivery = true;
      this.editForm = {
        ...this.currentRow,
        address: [
          this.currentRow.proviceCode,
          this.currentRow.cityCode,
          this.currentRow.countyCode,
        ],
      };
    },
    //确认收货
    async open() {
      this.editForm = {
        ...this.currentRow,
      };
      const { id } = this.editForm;
      console.log("id", id);
      const values = {
        id,
        orderStatus: 6,
      };
      this.$confirm("确认订单收货码?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          orderUpdate(values).then((res) => {
            if (res.success && res.code === "00000") {
              this.$message({
                message: "已确认收货成功",
                type: "success",
              });
              getOrderDetails({
                orderCode: this.currentRow.orderCode,
              }).then((res2) => {
                this.currentRow = res2.data;
              });
            }
          });
          // this.$message({
          //   type: "success",
          //   message: "已确认收货成功!",
          // });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消收货",
          });
        });
    },
    // 查看物流
    checkLogistics() {
      this.check = true;
    },
    //添加备注
    addNote() {
      this.note = true;
      this.editForm = {
        ...this.currentRow,
        address: [
          this.currentRow.proviceCode,
          this.currentRow.cityCode,
          this.currentRow.countyCode,
        ],
      };
    },
    // 取消发货按钮
    Canceldelivery() {
      this.delivery = true;
      this.editForm = {
        ...this.currentRow,
        address: [
          this.currentRow.proviceCode,
          this.currentRow.cityCode,
          this.currentRow.countyCode,
        ],
      };
    },
    // 修改物流
    ModifiedLogistics() {
      this.Modified = true;
    },
    // 修改订单收货信息
    editOrder() {
      this.dialogVisible = true;
      this.editForm = {
        ...this.currentRow,
        address: [
          this.currentRow.proviceCode,
          this.currentRow.cityCode,
          this.currentRow.countyCode,
        ],
      };
      console.log(this.editForm.address);
    },
    cancelgoodesmodel() {
      this.$emit("cancelgoodesmodel", false);
    }, //取消按钮 传值
    savegoodesmodel() {}, //保存 Goods 一些信息 接口函数
  },
  watch: {
    centerDialogVisible(newVal) {
      // 监听 centerDialogVisible 的变化
      if (!newVal) {
        // 当 centerDialogVisible 变为 false 时触发事件
        this.$emit("close-dialog");
      }
    },
  },
};
</script>

<style scoped lang="scss">
.orderContent {
  display: flex;
  width: 90%;
  height: 500px;
  margin-top: 20px;
  margin-left: 5%;
  // border: 1px solid pink;
  .orderLeft {
    border: 1px solid #eeeeee;
    width: 50%;
    padding: 10px 20px;
    .copy {
      width: 50px;
      height: 25px;
      background: #2d8cf0;
      color: #fff;
      margin-left: 10px;
      display: inline-block;
      line-height: 25px;
      text-align: center;
      cursor: pointer;
    }
    .orderEdit {
      background: #2d8cf0;
      color: #fff;
      width: 120px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      cursor: pointer;
    }
    div {
      margin-top: 20px;
      span:nth-child(1) {
        color: #676767;
      }
      span:nth-child(2) {
        color: #0d0d0d;
      }
    }
  }
  .orderRight {
    border: 1px solid #eeeeee;
    width: 50%;
    padding: 10px 20px;
    .orderStatus {
      font-size: 50px;
      color: #ff9900 !important;
    }
    .Modified {
      color: #57a3f3 !important;
      cursor: pointer;
    }
    .Cancellation {
      color: #57a3f3 !important;
      margin-left: 15px;
      cursor: pointer;
    }
    .addNote {
      color: #57a3f3;
      margin-left: 15px;
      cursor: pointer;
    }
    .logistics {
      color: #57a3f3;
      margin-left: 10px;
      cursor: pointer;
    }
    .Confirm {
      width: 80px;
      height: 30px;
      background: #2d8cf0;
      color: #fff;
      line-height: 30px;
      text-align: center;
      cursor: pointer;
    }
    .copy {
      width: 50px;
      height: 25px;
      background: #2d8cf0;
      color: #fff;
      margin-left: 10px;
      display: inline-block;
      line-height: 25px;
      text-align: center;
      cursor: pointer;
    }
    .orderEdit {
      background: #2d8cf0;
      color: #fff;
      width: 120px;
      height: 30px;
      line-height: 30px;
      text-align: center;
      cursor: pointer;
    }
    div {
      margin-top: 20px;
      span:nth-child(1) {
        color: #9fa8b5;
      }
      span:nth-child(2) {
        color: #0d0d0d;
      }
    }
  }
}
</style>
